// 全局mixin
@colorList: @primary-color, @success-color, @warning-color, @error-color, @heading-color, @text-color-secondary, @disabled-color; 
@colorLabel: primary, success, warning, error, heading, secondary, disabled;
.text-center {
    text-align: center;
}
#textColor(@i) when (@i <= 7) {
    @lable: extract(@colorLabel, @i);
    .text-@{lable} {
        color: extract(@colorList, @i) !important;
    }
    #textColor(@i+1);
}
#textColor(1);


/*
    margin padding fontSize width 通用样式表
*/
.loopStyle(@counter) when (@counter > 0) {
    .p-@{counter} {
      padding: (1px * @counter);
    } 
    .p-x-@{counter} {
      padding-left: (1px * @counter) ;
      padding-right: (1px * @counter) ;
    }
    .p-y-@{counter} {
      padding-top: (1px * @counter) ;
      padding-bottom: (1px * @counter) ;
    }
    .p-t-@{counter} {
      padding-top: (1px * @counter);
    }
    .p-r-@{counter} {
      padding-right: (1px * @counter);
    }
    .p-b-@{counter} {
      padding-bottom: (1px * @counter);
    }
    .p-l-@{counter} {
      padding-left: (1px * @counter);
    }
    .m-@{counter} {
      margin: (1px * @counter);
    }
    .m-x-@{counter} {
      margin: 0 (1px * @counter);
    }
    .m-y-@{counter} {
      margin:(1px * @counter) 0;
    }
    .m-t-@{counter} {
      margin-top: (1px * @counter);
    }
    .m-r-@{counter} {
      margin-right: (1px * @counter);
    }
    .m-b-@{counter} {
      margin-bottom: (1px * @counter);
    }
    .m-l-@{counter} {
      margin-left: (1px * @counter);
    }
    .fz-@{counter} {
      font-size: (1px * @counter) !important;
    }
    .width@{counter} {
      width: 1% * @counter;
    }
    .loopStyle((@counter - 1));    // 递归调用自身
}
.loopStyle(100);